<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8"/>
    <title>旅游登录</title>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<!-- 避免IE使用兼容模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="renderer" content="webkit">
<meta name="keywords" content='easyui,jui,jquery easyui,easyui demo,easyui中文'/>
<meta name="description" content='管理后台'/>
<title>管理后台</title>
<!--vue-->
<script src="/js/vue.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet" href="/css/index.css">

<!-- 引入组件库 -->
<script src="/js/index.js"></script>
<!--axios-->
<script src="/js/axios.min.js"></script>
<!--引入外部css样式-->
<link rel="stylesheet" href="../css/login.css">

<body>
<div class="box">
    <img src="../imgs/login/login.png" alt=""/>
    <div class="login-content">
        <div class="login-title">
            <h2>登录</h2>
            还没有账号？<a href="register.html">立即注册!</a>
        </div>
        <form action="" method="post">
            <div class="input-group">
                <input type="text" id="mobile" v-model="mobile" name="mobile" class="mobile"
                       placeholder="用户名" value=""/>
                <br/><br/>
                <input type="password" id="password" v-model="password" name="password" placeholder="密码" value=""/>
            </div>
            <div class="col">
                <button type="button" id="login" class="btn" @click="login">登录</button>
                &nbsp;&nbsp;&nbsp;&nbsp;
                <button type="button" id="reset" class="btn" @click="reset">重置</button>
            </div>
        </form>
    </div>
</div>
<script>
    var vue = new Vue({
        el: ".box",
        data: {
            mobile: '',
            password: ''
        },
        methods: {
            login() {
                _this = this;
                if (this.mobile == '' || this.password == '') {
                    _this.$message.error("用户名和密码不能为空！");
                    return;
                }
                //用户登录
                axios.get('/tuser/login?mobile=' + this.mobile + "&password=" + this.password).then(function (response) {
                    if (response.data.code == 200) {
                        location.href = "/html/front/indexshiyan.html";
                    } else {
                        _this.$message.error("用户名或者密码错误");
                    }
                }).catch(function (error) {
                    _this.$message.error("出错");
                });
            },
            reset() {
                this.mobile = '';
                this.password = '';
            }
        }
    });
</script>
</body>

</html>